<template>
  <div class="auth-page uk-height-viewport uk-flex uk-flex-center uk-flex-middle uk-text-center">
        <div class="authenticate-box">
            <form @submit.prevent="login">
              <div class="uk-card uk-card-default">
                <div class="uk-card-body">
                    <div class="auth-item">
                        <input class="uk-input uk-width-1-1" type="text" name="username" v-model="user.username" placeholder="用户名" autofocus="">
                    </div>
                    <div class="auth-item">
                        <input class="uk-input uk-width-1-1" type="password" name="password" v-model="user.password" placeholder="密码">
                    </div>
                </div>
                <button class="uk-button uk-button-primary uk-button-large uk-width-1-1" type="submit" @submit="login">登录</button>
              </div>
            </form>
        </div>
  </div>

</template>

<script>
  export default {
    name: 'login',
    components: { },
    data () {
      return {
        user: {
          username: '',
          password: ''
        },
        message: {
        }
      }
    },
    methods: {
      open (link) {
        this.$electron.shell.openExternal(link)
      },
      async login () {
        if (!this.user.username || !this.user.password) {
          return this.$message.warning('请输入用户名和密码')
        }
        const matches = (await this.$http.post('/auth', this.user)).data
        if (matches === true) {
          return this.$router.push('/')
        }
        return this.$message.error('用户名或密码错误')
      }
    }
  }
</script>